<template>
  <div class="cultivate">
    <el-form :inline="true" class="clearfix">
      <el-form-item label="安全培训名称">
        <el-input v-model="from.name"></el-input>
      </el-form-item>
      <el-form-item label="培训内容">
        <el-input v-model="from.content"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="medium">查询</el-button>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-refresh-right" size="medium">重置</el-button>
      </el-form-item>

      <hr />

      <div cless="sheet">
        <el-form-item margin-top="20px">
          <el-button type="primary" icon="el-icon-plus" plain size="small">新增</el-button>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-edit" plain size="small">编辑</el-button>
        </el-form-item>
        <el-form-item>
          <el-button type="danger" icon="el-icon-delete" plain size="small">
            删除</el-button>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-position" plain size="small">发布</el-button>
        </el-form-item>
      </div>

      <el-table :data="tableData">
        <el-table-column type="selection" width="50"> </el-table-column>
        <el-table-column type="index" label="序号" width="70">
          <template></template>
        </el-table-column>
        <el-table-column prop="cultivate" label="安全培训名称" width="230" FontSize="12px">
        </el-table-column>
        <el-table-column label="培训内容" width="190"> </el-table-column>
        <el-table-column prop="date" label="开始时间" width="190"></el-table-column>
        <el-table-column prop="finish" label="结束时间" width="190">
        </el-table-column>
        <el-table-column prop="name" label="负责人" width="100">
        </el-table-column>
        <el-table-column prop="status" label="状态" width="180">
        </el-table-column>
        <el-table-column label="培训资料" show-overflow-tooltip>
        </el-table-column>
      </el-table>

      <el-pagination background :page-sizes="[7, 10, 15, 20]" :page-size="7"
        layout="total, prev, pager, next, sizes, jumper " :total="100">
      </el-pagination>
    </el-form>
  </div>
</template>
<script>
export default {
  name: "cultivate",
  data() {
    return {
      from: {
        name: "",
        content: "",
      },
      tableData: [
        {
          date: "2016-05-02",
          finish: "2018-07-09",
          name: "王小虎",
          status: "未发布",
          cultivate: "上海市普陀区金沙江路 1518 弄+++++++++++++++++",
        },
        {
          date: "2016-05-02",
          finish: "2018-07-09",
          name: "王小虎",
          status: "未发布",
          cultivate: "上海市普陀区金沙江路 1518 弄",
        },
      ],
    };
  },
  activated() { },
  watch: {},
  created() { },
  mounted() { },
  methods: {},
};
</script>
<style lang="scss" scoped>
.clearfix {
  margin-top: 50px;
}

.cultivate {
  text-align: left;
}

hr {
  background-color: rgba(77, 76, 76, 0.158);
  margin-block: 30px;
}
</style>
